<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/static/layui/css/layui.css}" media="all">
</head>
<script type="text/javascript">
    var btnList = ['layui-btn-warm','layui-btn-danger'];
    function dict(obj,types) {
        var str = "";
        var index = 0;
        if(types === "state" ){
            if(obj.state == 0){//禁用
                index = 1;
                str = "禁用";
            }
            if(obj.state == 1){
                index = 0;
                str = "启动";
            }
        }

        var btn = "<a class='layui-btn layui-btn-xs layui-btn-radius "+btnList[index]+"'>"+str+"</a>";
        console.log("btn");
        console.log(btn);
        return btn;

    }

</script>
<body>
<div class="layui-form searchTable">
    <span>
        <div class="layui-inline">
            <div class="layui-input-inline">
                <input type="text" name="name" id="name" placeholder="名称" autocomplete="off" class="layui-input datePicker">
            </div>
        </div>
        <button id="searchBtn" class="layui-btn" data-type="reload" lay-event="query">查询</button>
         <button id="addUser" class="layui-btn" data-type="reload" lay-event="add">新增</button>
        <button id="editor" class="layui-btn" data-type="reload" lay-event="update">编辑</button>

    </span>
</div>

    <table class="layui-hide" id="SysUser" lay-filter="SysUser"></table>

    <script type="text/html" id="operation">
        <a class="layui-btn layui-btn-xs" lay-event="del" title="删除">删除</a>
    </script>

    <script th:src="@{/static/layui/layui.js}" charset="utf-8"></script>

<script>
    layui.use(['jquery','table','form','laydate'],function () {
        var table = layui.table;//表单
        var layer = layui.layer;
        var $ = layui.$;
        var laydate = layui.laydate;

        table.render({

            elem:'#SysUser',
            url:'/asmeQuery',
            method: 'post',
           // toolbar: '#toolbar', //开启头部工具栏，并为其绑定左侧模板
            defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
                title: '提示',
                layEvent: 'LAYTABLE_TIPS',
                icon: 'layui-icon-tips'
            }],
            title: 'SysUser',
            cols: [
                [
                 {type:'radio',fixed: 'left',width:50,align:'center'},
                {field: 'id', title:'ID', align:'center',width:100},
                {field: 'name', title:'名称', align:'center', width:200},
                {field: 'content', title:'内容', align:'center', width:200},
                {field: 'uri', title:'路径', align:'center', width:100},
                 {field: 'rank', title:'排序', align:'center', width:100},
                {field: 'state', title:'状态', align:'center', templet:function (data) {return dict(data,"state");}, width:100},
                {field: 'createdate', title:'创建时间',width:300, align:'center'},
                {field: 'updatedate', title:'更新时间', align:'center',width:300},
                {fixed: 'right', title:'操作', toolbar: '#operation', width:150, align:'center'}
                ]
            ],
            page: true,//每页条数默认10
            request: {
                pageName :"currentPage",
                limitName : "pageSize"
            },
            parseData: function (res) {//res 即为原始返回的数据
                console.log(res);
                return {
                    "code": 0, //解析接口状态
                    "msg": "", //解析提示文本
                    "count": res.count, //解析数据长度
                    "data": res.list //解析数据列表
                };
            }

        });


        //模糊查询
        var $  = layui.$;
        var active = {
            reload : function () {
                var vague = $("#name").val();
                var obj = {};
                if(vague != ""){
                    obj['name'] = vague;
                }
                if(vague == "" || vague == null){
                    layer.msg("请输入值");
                    return;
                }
                table.reload('SysUser',{
                    page: {
                        curr : 1
                    },
                    url: '/asmeDimQuery/'+vague,
                    method : 'POST',
                    where : obj,
                    done : function (res,curr,count) {
                        this.where  = {};
                    }
                },'data');
            }
        };

        $("#addUser").on("click",function () {
            var index = layer.open({
                type:2,
                area :['700px','450px'],
                fixed: false,
                maxmin: true,
                content : '/asmeAdd'
            });
            layer.full(index);
        })

        $("#editor").on("click",function () {
            var checkStatus = table.checkStatus('SysUser')
                ,data = checkStatus.data;
            if(data.length==0){
                layer.msg("还未选中哟")
                return;
            }
            var index;
            for (var i=0;i<data.length;i++){
                index=data[0].id
            }
            layer.open({
                type: 2,
                area: ['700px','450px'],
                fixed: false,
                maxmin: true,
                content: '/asmeEdit?id='+index,
            });
        })



        $("#searchBtn").on("click",function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : "";
        });


        //新增
        table.on("toolbar(SysUser)",function (object) {
            switch(object.event){

                case 'LAYTABLE_TIPS' :
                    layer.alert('这是一个自定义的图标');
                    break;
            }

        });

        //删除事件
        table.on("tool(SysUser)",function (object) {
            var data = object.data;//获取到你点击的哪一行的所有数据
            if(object.event === "del"){//删除
                layer.confirm('删除只是将状态改为禁用，确认要删除该管理员吗？', function(index){
                    //object.del();
                    var obj = {
                        id: data.id,
                        state: 0
                    };
                    $.post("/asme-del",obj,function (data) {
                        if(data.success){
                            layer.msg("删除成功",{
                                icon: 1,
                                time: 2000
                            });
                        }else{
                            layer.msg("删除失败",{
                                icon: 1,
                                time: 2000
                            });
                        }
                    },"json");
                    location.reload()
                    layer.close(index);
                });
            }
        })
    })
</script>

</body>
</html>